<!DOCTYPE html>
	<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1.0">
		<title>Document</title>
         <link rel="stylesheet" href="../layui/css/layui.css">
		<link rel="stylesheet" type="text/css" href="../css/information-t.css">
	</head>
	<style type="text/css">
            #paymentpaw{
            width: 100%;
            position:fixed;
            width: 100%;
            height: 100%;
            display: none;
            z-index: 9999;
            background: rgba(0,0,0,0.5);
        }
        .enter{
            width: 100%;
            background:#FFFFFF;
            z-index: 102;
            position: fixed;
            bottom:0;
            z-index: 102;
            height: 50%;

        }
        .enter-close{
            width: 100%;
            padding: 1% 0;
        }
        .enter-close i{
            width: 1.5em;
            height: 1.5em;
            display: block;
            float: right;
            margin-right: 3%;
            margin-top: 3%;
            font-style: normal;
        }
        .enter-text{
            width: 100%;
            text-align: center;
            color: #8D8D8D;
            border-bottom:2px solid #F5F5F5 ;
            padding: 2% 0;
            margin-bottom: 4%;
        }
        .enter-input{
            text-align: center;

        }
        .enter-input input{
            width: 90%;
            border: 1px solid #CCCCCC;
            padding: 2% 0;
            text-align: center;
            font-size: 16px;
            display: inline-block;

        }
        .queding{
            padding: 3%;
        }
        .queding span{
            width: 100%;
            display: block;
            background: #57d5f3;
            border-radius: 15px;
            color: #fff;
            padding: 5px 0;
            text-align: center;
        }
        </style>
	<body>
		<div class="select">
			<div>
				<div class="center select-t">
					<p>报名</p>
					<img src="../img/cancel.png" class="close">
				</div>
				<div class="select-b">
					<p>提示：报名即扣除1美金</p>
					<div class="flex top-up-box">
						<p id="m-number">账户余额：<span>￥300</span></p>
						<div class="top-up"><a style="color:#57d5f3;text-decoration: none" href="recharge_usd.html">去充值</a></div>
					</div>
					<div class="sure center">确定报名</div>
				</div>
			</div>
		</div>
		<header>
			<a href="javascript:history.back(-1)" class="back"><img src="../img/back.png" height="18px"></a>
			<div class="center title">出游信息</div>
		</header>
		<main>
			<div class="lvyou">
             <!--    <div class="flex information">
                <img src="../img/logo.png" height="50px">
                <div>
                    <div class="flex infor-r">
                        <img src="../img/description.png" width="15px">
                        <p>有人星期天一起去西冲玩吗？</p>
                    </div>
                    <div class="flex infor-r">
                        <img src="../img/site.png" width="15px">
                        <p>坂田-西冲</p>
                    </div>
                    <div class="flex infor-r">
                        <img src="../img/time.png" width="15px">
                        <p>4月20日下午5点</p>
                    </div>
                </div>
            </div>
            <div class="parting-line"></div>
            <div class="content">
                <div class="flex">
                    <p>需要人数：<span>1人</span></p>
                    <p>悬赏金：<span>500美金</span></p>
                </div>
                <p>诚意金：<span>10美金</span></p>
                <div class="flex">
                    <p>支付方式</p>
                    <div class="pay-r">
                        <span><input type="radio" name="pay" checked>平台担保</span>
                        <span><input type="radio" name="pay">线下支付</span>
                    </div>
                </div>
            </div>  -->      
            </div>
			<div class="parting-line"></div>
			<div>
				<div class="apply center">报名</div>
			</div>
		</main>
   		<div id="paymentpaw">

            <div class="enter">
                <div class="enter-close clearfix">
                    <i>x</i>
                </div>
                <div class="enter-text">请输入支付密码</div>
                <div class="enter-input">
                    <input type="password" name="pay" placeholder="输入支付密码">
                </div>

                <div class="queding"><span>确定发布</span></div>
            </div>
        </div>
		<script src="../js/jquery-3.3.1.js"></script>
        <script src="../layui/layui.js"></script>
        <script src="../layui/layui.all.js"></script>
		<script src="../js/information-t.js"></script>
	</body>
</html>
<script type="text/javascript">
    function getUrlParam(name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
            var r = window.location.search.substr(1).match(reg);  //匹配目标参数
            if (r != null) return unescape(r[2]); return null; //返回参数值
        }
        //接收URL中的参数id
        var id = getUrlParam('id');
        console.log(id);

        $.ajax({
            url:'/meiyou/selTourDetails',
            type:"post",
            data:'tId='+id,
            success:function(data){
                console.log(data);
                $('.lvyou').append("<div class=\"flex information\">\n" +
"                <img src=\"../img/logo.png\" height=\"50px\">\n" +
"                <div>\n" +
"                    <div class=\"flex infor-r\">\n" +
"                        <img src='"+data[0].t_img+"' width=\"15px\">\n" +
"                        <p>"+data[0].t_count+"</p>\n" +
"                    </div>\n" +
"                    <div class=\"flex infor-r\">\n" +
"                        <img src=\"../img/site.png\" width=\"15px\">\n" +
"                        <p>"+data[0].t_faddress+"-"+data[0].t_taddress+"</p>\n" +
"                    </div>\n" +
"                    <div class=\"flex infor-r\">\n" +
"                        <img src=\"../img/time.png\" width=\"15px\">\n" +
"                        <p>"+data[0].t_sdate+"</p>\n" +
"                    </div>\n" +
"                </div>\n" +
"            </div>\n" +
"            <div class=\"parting-line\"></div>\n" +
"            <div class=\"content\">\n" +
"                <div class=\"flex\">\n" +
"                    <p>需要人数：<span>"+data[0].t_num+"人</span></p>\n" +
"                    <p>悬赏金：<span>"+data[0].t_meijin+"美金</span></p>\n" +
"                </div>\n" +
"                <p>诚意金：<span>"+data[0].j_value+"美金</span></p>\n" +               
"            </div>       ");
                 $.each($('.pay-r span'),function(){
                var checked=$(this).find('input[type="radio"]').prop('checked');
                if(checked){
                    $(this).css('color','#57d5f3');
                }
        });
            }
        });

       
        $(document).on('click','.pay-r span',function(){
             $(this).find('input[type="radio"]').prop('checked',true);
            $(this).css('color','#57d5f3').siblings().css('color','#666');
        });
        $('.sure').click(function(){
            $(this).hide();
            $('#paymentpaw').show();
        });
        $('.enter-close').click(function(){
             $('#paymentpaw').hide();
        });
        $('.queding').click(function(){
            var uCount = localStorage.getItem("uCount");
            var pay=$('input[name="pay"]').val();
            $.ajax({
                url:'/meiyou/TourApply',
                type:'post',
                data:{uCount:uCount,pay:pay,tId:id},
                success:function(data){
                    console.log(data);
                    if(data.code==100){
                         layer.msg(data.msg,function(){
                    window.location.reload();
                });
                     }else{
                         layer.msg(data.msg);
                     }
                    
                }
            });
        });

$.post('/meiyou/getMeijin',function(data){
        $('#m-number span').text("￥"+data.meijin);
    });



</script>